import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex);

//新建状态对象,有个count属性
const state = {
    count: 1,
    age: 24

}
//通过这个对象的方法来对state的count值进行改变,
//这里的mutations是固定的写法，意思是改变的
const mutations = {
    add(state, n) {
        state.count += n;
    },
    reduce(state) {
        state.count--;
    }
}

const getters={
    //过滤count值,每次取count值时候都会先走getter
    count:function(state){
        return state.count +=100;
    }
}

//异步修改状态值
const actions={
    //可以直接传上下文
    addAction(context){
        setTimeout(()=>{ context.commit('add',5)},3000);
        console.log('actions.先打印,再执行的操作方法,异步');
    },
    //也可以直接传包装后的commit
    reduceAction({commit}){
        commit('reduce');
    }
}

//将state对象加入Vuex的状态仓库并抛出
export default new Vuex.Store({
    state, mutations,getters,actions
})